<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport"
          content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no"/>
    <title>确认订单</title>
    <link rel="stylesheet" type="text/css" href="../css/aui.css"/>
    <link rel="stylesheet" type="text/css" href="../css/style.css"/>
    <link rel="stylesheet" type="text/css" href="../css/common.css"/>
    <link rel="stylesheet" type="text/css" href="../css/aui-flex.css"/>
    <style>
        body {
            background: #f3f3f3;
            font-size: 16px;
            overflow: auto;

        }
        /*::-webkit-scrollbar{display:none;}*/
        .payContain{
            overflow: hidden;
        }
        .aui-nav {
            height: auto;
        }

        .aui-icon-left {
            padding-left: 10px;
        }

        .aui-iconfont {
            position: absolute;
        }

        .content {
            display: inline-block;
        }

        .contents {
            margin-left: 25px;
            margin-right: 15px;
            text-align: left;
        }

        .contents > span {
            display: block;
        }

        .icon {
            position: absolute;
            top: 50%;
            text-align: center;
            -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
        }

        .address {
            margin-top: 4px;
        }

        .addressTop.aui-tab-nav li {
            line-height: inherit;
            height: auto;
            position: relative;
            padding: 15px;
            width: 100%;
            color: #fff;
        }

        .aui-tab-nav {
            height: inherit;
            display: block;
            background: #4f6ea6;
        }

        .haderTitle li > span {
            float: left;
            display: block;
        }

        .detail {
            overflow: hidden;
            padding: 5px 15px;
        }
        .detail p{
            color: #666 !important;
            font-size: 13px;
        }

        /*.good-pirce {
            color: #ff0005;
            font-weight: bold;
        }*/

        .total {
            margin-top: 10px;
        }

        .haderTitle li > span {
            float: left;
            display: block;
        }

        .contain {
            margin-top: 45px;
            margin-bottom: 140px;
        }

        .contain .aui-tab-nav li {
            line-height: inherit;
            height: auto;
            position: relative;
            padding: 15px;
            width: 100%;
        }

        .contain .aui-tab-nav {
            height: inherit;
            display: block;
        }

        .contents {
            margin-left: 25px;
            margin-right: 15px;
            text-align: left;
        }

        .content {
            display: inline-block;
        }

        .contents > span {
            display: block;
        }

        .time {
            display: block;
        }

        .icon {
            position: absolute;
            top: 50%;
            text-align: center;
            -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
        }

        .address {
            margin-top: 8px;
        }

        .good {
            background: #fff;
            margin-bottom: 15px;
        }

        .good-info-list {
            color: #a3a3a3;
            font-size: 12px;
            line-height: 1.4;
        }

        .company-name {
            height: 40px;
            line-height: 40px;
            font-size: 14px;
            background: #fff;
            padding-left: 15px;
            position: relative;
        }

        .good_bottom {
            /*padding: 15px;*/
        }

        .good_bottom ul li {
            overflow: hidden;
            margin-bottom: 5px;
        }

        .good_bottom ul li span {
            display: block;
        }

        .shiji {
            font-weight: bold;
            font-size: 18px;
        }

        .good-info .aui-list-view {
            margin: 0;
        }

        .contact {
            overflow: hidden;
        }

        .contactMeg, .contactPhone {
            display: block;
            padding: 5px 30px;
            border: 1px solid #9c9c9c;
            float: left;
            width: 48%;
            margin-top: 10px;
        }

        .contactMeg {
            margin-right: 2%;
        }

        .menuRgiht {
            float: right;
            margin-right: 20px;
        }

        .good_bottom {
            background: #fff;
        }

        .aui-iconfont {
            margin-right: 5px;
        }

        .total {
            margin-top: 15px;
            margin-bottom: 10px;
        }

        /*.total .good-pirce {
            font-size: 18px;
        }*/

        input[type="text"] {
            margin: 0;
        }

        .waitingTips {
            width: 100%;
            background: #ffd9cd;
            text-align: center;
            height: 25px;
            line-height: 25px;
            overflow: hidden;
            color: #ff6868;
            font-size: 12px;
        }

        /*下面弹出的样式*/
        .pickerToTop {
            position: fixed;
            bottom: 0;
            -webkit-transform: translateY(395px);
            height: 395px;
            overflow-y: auto;
            -webkit-transition: .5s;
            transition: .5s;
            z-index: 999;
            width: 100%;
            text-align: center;
            background: #fff;
            width: 200%;
        }

        .toTopAnimate {
            -webkit-transform: translateY(00px);
        }

        .pickerToTop .aui-list-view-cell:not(:first-of-type) {
            text-align: left;
        }

        /*.pickerToTop .aui-list-view-cell:last-of-type:after{
            border: 0;
        }*/
        .pickerToTop .myBtn {
            position: fixed;
            bottom: 0;
            width: 50%;
        }

        .myBorder {
            /*height: 8px;*/
            /*background: #797979;*/
        }

        .paw {
            background: url(../image/pawbg.jpg);
            background-size: contain;
            margin: 0 auto;
            width: 270px !important;
            letter-spacing: 40px;
        }

        .pickerToTop .aui-iconfont {
            position: absolute;
            left: 10px;
            top: 10px;
            font-size: 20px;
            color: #000;
            z-index: 9;
        }

        .pay, .checkCard {
            float: left;
            width: 50%;
            position: relative;
        }

        .pickerToTop .aui-list-view-cell:after {
            /*border: 0;*/
        }

        .title {
            background: #fff;
            padding: 15px;
        }

        .good_bottom .aui-list-view:after {
            border: 0;
        }

        span.xiaoji {
            position: relative;
            display: block;
            padding: 0 8px;
        }

        span.xiaoji:nth-of-type(2):before {
            position: absolute;
            content: "";
            width: 1px;
            background: #b6b6b6;
            top: 2px;
            right: 0;
            bottom: 2px;
        }

        .good-info {
            margin-bottom: 15px;
        }

        .checkCard .myBtn {
            background: none;
            color: #000;
        }

        .pickerToTop2 {
            transition: 0.5s;
        }

        .showCar {
            -webkit-transform: translateX(-50%);
        }

        .pickerToTop ul li:not(:first-of-type) {
            font-size: 14px;
        }

        .payList li {
            position: relative;

        }

        .payList li img {
            width: 25px;
            vertical-align: middle;
            margin-right: 5px;
        }

        .payList li.payActive:before {
            content: "\e645";
            font-family: "auiicon" !important;
            right: 20px;
            position: absolute;
            width: 20px;
            height: 20px;
            border-radius: 50%;
            color: #327afa;
            border: 1px solid #327afa;
            line-height: 20px;
            text-align: center;
        }

        .pickerToTop2 {
            width: 100%;
            overflow: hidden;
            height: inherit;
        }

        .btnAddCard {
            z-index: 99;
        }

        .result {
            display: none;
            padding: 15px;
            background: #fff;
        }

        .spanOk {
            display: block;
            border-radius: 50%;
            width: 50px;
            height: 50px;
            background: #ff3333;
            position: relative;
            margin: 0 auto;
            margin-bottom: 10px;
        }

        .spanOk:before {
            position: absolute;
            content: "\e645";
            left: 26%;
            top: 10%;
            color: #fff;
            font-size: 25px;
        }

        .ok {
            text-align: center;
            padding-bottom: 15px;
            margin-bottom: 15px;
        }

        .result .aui-btn {
            width: 45%;
            float: left;
            margin-top: 15px;
            margin-right: 10px;
            overflow: hidden;
        }

        .result .waring {
            font-size: 12px;
            color: #646464;
            overflow: hidden;
            margin-top: 15px;
            width: 100%;
        }

        .btns {
            overflow: hidden;
        }
        .result .aui-btn-block{
            width: 100%;
            height:35px;
            line-height:35px;
        }
    </style>
</head>

<body>
<header class="aui-bar aui-bar-nav aui-border-b">
  <div class="aui-pull-left aui-iconfont aui-icon-left icon-left-coler" tapmode onclick="closeWin()"></div>
  <div class="aui-title">确认订单</div>
</header>
<div class="payContain">
    <footer class="aui-nav ">
        <div class="detail aui-border-t">
            <div class="aui-pull-left">
                <p>店铺优惠: <span id="discount">无</span></p>

                <p>运费总计: <span id="expressAll">--</span></p>

                <p>货款总计: <span id="goodsPrice">--</span></p>
            </div>
            <div class="aui-pull-right total">
                <p style="font-size:16px;">总计: <span id="priceAll" class="aui-text-danger" style="font-size:18px;">--</span></p>

            </div>
        </div>
        <div class="myBtn aui-bg-danger" tapmode onclick="orderSubmit()">提交订单</div>
    </footer>
</div>
<!-- 控制影藏显示 -->
<div class="result">
    <div class="ok aui-border-b">
        <span class="aui-iconfont aui-icon-check spanOk"></span>
        <p>支付成功</p>
    </div>
    <div class="resultTips">
        <h3 style="color:#666;">发货信息</h3>
        <p style="margin-top:5px;">我们将尽快安排发货，请买家保持手机通讯畅通，以便快递哥哥能第一时间联系到您。</p>
    </div>

    <div class="aui-flex-col" style="margin-bottom: 15px;">
        <div class="aui-flex-item-6" style="padding: 0 5px;">
            <div class="aui-btn aui-btn-primary aui-btn-block aui-btn-outlined" onclick="goback();">
                返回
            </div>
        </div>
        <div class="aui-flex-item-6" style="padding: 0 5px;">
            <div class="aui-btn aui-btn-primary aui-btn-block aui-btn-outlined" onclick="go2Home();">
                去首页
            </div>
        </div>
    </div>

    <div class="waring">
        <em style="color:#ff3333">＊</em>安全提醒：中纺互联不会以任何理由要求您提供银行卡信息或支付额外费用，请谨防钓鱼链接或诈骗电话。
    </div>
</div>
</body>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/common.js"></script>
<script type="text/javascript" src="../script/doT.min.js"></script>
<script type="text/javascript" src="../script/jquery-1.11.3.js"></script>
<script type="text/javascript" src="../script/mui.js"></script>
<script type="text/javascript" src="../script/index.js"></script>
<script type="text/javascript">
    var companyId, companyName,header,footer,orderListData;
    var totalMoney,orderId,orderNo;
    apiready = function () {
        api.parseTapmode();
        header = $api.dom('header');
        footer = $api.dom('footer');
        $api.fixIos7Bar(header);

        getStorageAll();

        //验证地址
        validateAddress(user_name);

        //重新更新地址监听
        api.addEventListener({
            name: 'addressAdd'
        }, function (ret) {
            if (ret && ret.value) {
                validateAddress(user_name);
            }
        });

        //监听支付成功
        api.addEventListener({
            name:'payOrderSuccess'
        }, function(ret, err){
            $('.aui-title').text('支付成功');

            api.closeFrame({
                name: 'orderConfirm_frm'
            });

            $('.payContain').hide();
            $('.result').show();
        });

        //重复订单提交标识
        $api.rmStorage('_hasPostedOrder');

        $('.spanOk').css({'margin-top': $api.offset($api.dom('body')).h*1/10+'px'});
    }

    function loadData(addressData){
        showLoading();

        var goodsId, str, companyName;
        //加载商品数据
        goodsId = $api.getStorage('_itemId');
        if (goodsId) {
            str = $api.getStorage('_str');
            companyName = $api.getStorage('_companyname');
            // //清除缓存
            // $api.rmStorage('_itemId');
            // $api.rmStorage('_str');
            // $api.rmStorage('_companyname');
            data = {
                goodsId: goodsId,
                str: str,
                companyName: companyName,
                userName: user_name,
            };
        } else {
            //从订货单列表进来
            var goodsIds = api.pageParam.goodsIds;
            data = {
                goodsIds: goodsIds,
                userId: user_id,
                userName: user_name,
            };
        }
        var url = "Order/orderData";
        ajaxRequest(url, 'post', data, function (ret, err) {
            if (ret.status == 1) {
                //订单数据存入缓存
                $api.setStorage('_orderDatas', ret.msg);
                $("#expressAll").text('¥'+ret.msg.expressAll);
                $("#goodsPrice").text('¥'+ret.msg.goodsPrice);
                $("#priceAll").text('¥'+ret.msg.priceAll);
                totalMoney=ret.msg.priceAll;
                //显示内页
                var header_h = $api.offset(header).h;
                var footer_h = $api.offset(footer).h;
                var body_h = $api.offset($api.dom('body')).h - header_h - footer_h;
                orderListData=ret.msg.order;

                api.openFrame({
                    name: 'orderConfirm_frm',
                    url: './orderConfirm_frm.html',
                    rect: {
                        x: 0,
                        y: header_h,
                        w: $api.offset($api.dom('body')).w,
                        h: body_h
                    },
                    pageParam: {
                        orderData:orderListData,
                        addressData:addressData
                    },
                    bounces: true,
                    bgColor: 'rgba(0,0,0,0)',
                    vScrollBarEnabled: false,
                    hScrollBarEnabled: false
                });
            } else {
                api.toast({
                    msg: '获取订单失败',
                    duration: 2000,
                    location: 'bottom'
                });
            }
            hideLoading();
        });
    }

    //验证用户地址
    function validateAddress(user_name) {
        var url = "User/validateAddress/userName/" + user_name;
        data = {};
        ajaxRequest(url, 'get', data, function (ret, err) {
            if (ret.status == 1) {
                $api.setStorage('_addressOrder', ret.msg);

                loadData(ret.msg);

                //获取地址Id
                addressId = ret.msg.cityCode;
                api.sendEvent({
                    name: 'getAddressId',
                    extra: {
                        key: 'true'
                    }
                });
            } else {
                api.openFrame({
                    name: 'addressAdd',
                    url: 'my/addressAdd.html',
                });
            }
        });
    }

    //提交订单到数据库
    function orderSubmit() {
        var hasPostedOrder = $api.getStorage('_hasPostedOrder');
        if(hasPostedOrder){
            showPayAction();
        }else{
           showLoading();
           var addressOrder = $api.getStorage('_addressOrder');
           var orderDatas = $api.getStorage('_orderDatas');
           var url = "Order/orderSubmit";

           data = {
                userId: user_id,
                userName: user_name,
                addressOrder: addressOrder,
                orderDatas: orderDatas,
            };
            ajaxRequest(url, 'post', data, function (ret, err) {
                if (ret.status == 1) {
                    $api.setStorage('_hasPostedOrder',true);
                    $api.rmStorage('_addressOrder');
                    $api.rmStorage('_orderDatas');
                    orderId=ret.msg;
                    //发送监听
                    api.sendEvent({
                        name: 'updateCart',
                        extra: {
                            key: 'true'
                        }
                    });

                    //弹出支付窗口
                    showPayAction();
                } else {
                    api.toast({
                        msg: '订单提交失败',
                        duration: 2000,
                        location: 'bottom'
                    });
                }
                hideLoading();
            });
        }
    }

    //弹出支付窗口
    function showPayAction(){
        api.openFrame({
            name: 'my/payPage_frm',
            url: 'my/payPage_frm.html',
            animation:{
                type:"none"             
            },
            pageParam:{
                money:totalMoney,
                orderId:orderId,
                orderNo:orderId
            }
        });
    }

    //返回
    function goback(){
        api.closeToWin({
            name: 'root'
        });
    }

    //跳转到首页
    function go2Home(){
        api.execScript({
            name: 'root',
            script: 'showHome()'
        });

        api.closeToWin({
            name: 'root',
            animation: {
                type: 'flip',
                subType: 'from_bottom',
                duration: 500
            }
        });
    }
</script>

</html>
